<template>
	<view>
		<view class="head">
			选择要上传{{this.firstRacetracks}}赛道作品音频文件<span style="color: red;">(*必填)</span>
		</view>
		<view class="main">
			
			<uni-file-picker
				v-model="workValue[0]" 
				fileMediatype="all" 
				file-extname="mp3"
				mode="grid" 
				@select="select" 
				@progress="progress" 
				@success="successwork1" 
				@fail="fail" 
				:limit="1"
			/>
		</view>
		<view v-if="secoundRacetracks != ''">
			<view class="head">
				选择要上传{{this.secoundRacetracks}}赛道作品音频文件<span style="color: red;">(*必填)</span>
			</view>
			<view class="main">
				<uni-file-picker
					v-model="workValue[1]" 
					fileMediatype="all" 
					file-extname="mp3"
					mode="grid" 
					@select="select" 
					@progress="progress" 
					@success="successwork2" 
					@fail="fail" 
					:limit="1"
				/>
		</view>
		</view>
			<view class="head">
				上传比赛宣言<span style="color: green;">(选填)</span>
			</view>
			<view class="main">
				<uni-file-picker
					v-model="imageValue" 
					fileMediatype="all" 
					file-extname="mp4"
					mode="grid" 
					@select="select" 
					@progress="progress" 
					@success="successdeclaration" 
					@fail="fail" 
					:limit="1"
				/>
			</view>
		
		
		<view class="button">
			<button type="primary" @click="button">提交完成报名</button>
		</view>
	</view>
</template>

<script>
	import singUp from "@/api/singUp.js"
	import upload from "@/api/upload.js"
	export default {
		data() {
			return {
				imageValue:[],
				workValue:[],
				racetracks:[],
				uploadForm:{
					competitionId:0,
					openId:"",
					filePath1:"",
					filePath2:"",
					declarationFilePath:""
				},
				firstRacetracks:"",
				secoundRacetracks:""
			}
		},
		async onLoad(e){
			//打印传递的参数
			this.uploadForm.competitionId = e.id
			//获取用户openid存储一下
			this.uploadForm.openId = uni.getStorageSync("token_openid");
			//获取赛道信息
			await this.getRegistrationRacetrack()
		},
		methods: {
			updateTrackname(data){
				let racetracks = this.racetracks
				if(data.length == 1){
					//需要上传一个参赛作品
					for(var j = 0;j<racetracks.length;j++){
						if(racetracks[j].value == data[0].racetrack){
							this.firstRacetracks = racetracks[j].text
						}
					}
				}else if(data.length == 2){
					//需要上传两个参赛作品
					for(var j = 0;j<racetracks.length;j++){
						if(racetracks[j].value == data[0].racetrack){
							this.firstRacetracks = racetracks[j].text
						}
						if(racetracks[j].value == data[1].racetrack){
							this.secoundRacetracks = racetracks[j].text
						}
					}
				}
			},
				getRegistrationRacetrack(){
					singUp.get_registration_racetrack().then(res=>{
						res.data.forEach((item,index)=>{
							this.racetracks.push({"text":item.raceTrackName,"value":item.id})
							this.userRegistrationInformation()
						})
					})

				},
				userRegistrationInformation(){
					const data = {
						competitionId:this.uploadForm.competitionId,
						openId:this.uploadForm.openId
					}
					singUp.get_user_registration_info(data).then(res=>{
						if(res.code == 200){
							//更新上传表单
							this.updateTrackname(res.data)
						}
					})
					
				},
			    select(e){
					e.tempFiles[0].file.cloudPath = this.uploadForm.openId+".mp3"
			    },
			    // 获取上传进度
			    progress(e){},
			    // 上传成功
			    successwork1(e){
			        //上传成功之后获取文件信息(只上传一个文件获取0即可)
					this.uploadForm.filePath1 = e.tempFilePaths[0]
			    },
				successwork2(e){
				    //上传成功之后获取文件信息(只上传一个文件获取0即可)
					this.uploadForm.filePath2 = e.tempFilePaths[0]
				},
			    // 上传失败
			    fail(e){
			        
			    },
				button(){
					if(this.workValue.length == 0){
						uni.showToast({
							title: `请先上传音频文件`,
							icon:"none",
							duration: 2000
						})
						return
					}
					if(this.secoundRacetracks!=""){
						if(this.workValue.length == 1){
							uni.showToast({
								title: `请先上传第二赛道音频文件`,
								icon:"none",
								duration: 2000
							})
							return
						}
					}

					upload.audio_upload(this.uploadForm).then(res=>{
						uni.showToast({
							title: `报名成功`,
							duration: 2000
						})
						uni.switchTab({
							url:"../index/index"
						})
					})
				}
		}
	}
</script>

<style scoped>
.head{
	margin: 40rpx;
	text-align: center;
}
.main{
	margin: 50rpx 40rpx;
	text-align: center;
}

.button{
	margin: 140rpx 40rpx;
}
</style>
